/**
 * Created by Administrator on 2017/8/4.
 */


import React ,{ Component }from 'react'
import {View, Image ,StyleSheet ,TextInput,Dimensions,Text,TouchableOpacity,ToastAndroid} from 'react-native'
import {NavigationActions} from 'react-navigation'
import RequestUtils from '../Common/NetUtils'
import constant from '../Common/Constant'
import StorageUtils from '../Storage/StorageUtil'
let bc_img = require('../Img/bg_2x.png')
let bc_head = require('../Img/icon.png')
let input_user = require('../Img/icon_yonghuming.png')
let input_ps = require('../Img/icon_mima.png')

const ScreenSize = {
    width: Dimensions.get('window').width,
    height: Dimensions.get('window').height
};


export default class LoginPage extends Component {

    static navigationOptions = ({navigation}) => ({
        headerStyle:{
            height:0
        }
    })

    constructor(props){
        super(props)
        this.state ={
            input_phone:'',
            input_pw:''
        }
    }

    render() {
        return(
            <Image style={styles.imgSty} source={bc_img}>
                <Image style={styles.iconImg} source={bc_head}></Image>
                <View style={[styles.inputLl,{marginTop:35}]}>
                    <Image style={styles.inputImg} source={input_user}/>
                    <TextInput style={styles.inputTv} placeholder='请输入您的手机号' underlineColorAndroid='transparent'
                               onChangeText={(text) => this.setState({input_phone:text})}/>
                </View>
                <View style={[styles.inputLl,{marginTop:8}]}>
                    <Image style={styles.inputImg} source={input_ps}/>
                    <TextInput style={styles.inputTv} placeholder='请输入您的密码' underlineColorAndroid='transparent'
                    onChangeText={(text)=>this.setState({input_pw:text})}/>
                </View>
                <Text style={styles.forgetTv} onPress={()=>this.props.navigation.navigate('Register',{params:'forget',onResult:(state)=>{
                   ToastAndroid.show(state,ToastAndroid.SHORT)
                }})}>忘记密码</Text>
                <TouchableOpacity style={[styles.login,{marginTop:45}]}
                                  onPress={()=>this._userLogin()}>
                    <Text style={[styles.tv,{color:'#20AE8D'}]}>登录</Text>
                </TouchableOpacity>
                <TouchableOpacity style={[styles.register,{marginTop:19}]}
                                  onPress={()=>this.props.navigation.navigate('Register',{params:'register'})}>
                    <Text style={styles.tv}>注册</Text>
                </TouchableOpacity>

            </Image>
        )
    }


    _userLogin(){
        if(this.state.input_phone === '' || this.state.input_pw === ''){
            ToastAndroid.show('信息不完整',ToastAndroid.SHORT)
            return
        }
        let params = {'phone':this.state.input_phone,'password':this.state.input_pw,'registration_id':'1507bfd3f7f3f670385 '}

        RequestUtils.getData(constant.URL_USER_LOGIN,params,(result)=>{
            console.log('nimabi:'+result.data.phone)
            // ToastAndroid.show('登录成功'+JSON.parse(result).code,ToastAndroid.SHORT)
            StorageUtils._sava('loginresult',result)
            this.props.navigation.dispatch(resetAction)
        })
    }

}

const resetAction = NavigationActions.reset({
    index: 0,
    actions: [
        NavigationActions.navigate({ routeName: 'Host'})
    ]
})

const styles = StyleSheet.create({
    imgSty:{
        width:ScreenSize.width,
        height:ScreenSize.height+25,
        alignItems:'center',
        resizeMode:'cover',
    },
    iconImg:{
        width:120,
        height:120,
        borderRadius:60,
        marginTop:50
    },
    inputLl:{
        marginRight:32,
        marginLeft:32,
        width:ScreenSize.width-64,
        height:50,
        flexDirection:'row',
        alignItems:'center',
        borderBottomColor:'#fff',
        borderBottomWidth:1
    },
    inputImg:{
        width:22,
        height:25,
        marginLeft:16
    },
    inputTv:{
        marginLeft:12,
        flex:1
    },
    forgetTv:{
        marginTop:16,
        color:'#fff',
        fontSize:14
    },
    login:{
        marginRight:32,
        marginLeft:32,
        width:ScreenSize.width-64,
        height:45,
        borderRadius:22.5,
        backgroundColor:'#fff',
        alignItems:'center',
        justifyContent:'center'
    },
    register:{
        marginRight:32,
        marginLeft:32,
        width:ScreenSize.width-64,
        height:45,
        borderRadius:22.5,
        borderColor:'#fff',
        borderWidth:1,
        backgroundColor:'transparent',
        alignItems:'center',
        justifyContent:'center'
    },
    tv:{
        color:'#fff',
        fontSize:16
    }
})


